@import '../vendor/modularscale';
@import '../variables';
@import '../css-variables';
@import 'scrollbar';
@import '../mixins';


/*
 * Reset
 */
*,
*:before,
*:after {
    box-sizing: border-box;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
figure,
form,
fieldset,
p,
blockquote,
th,
td {
    margin: 0;
    padding: 0;
}

img {
    height: auto;
    max-width: 100%;
    vertical-align: top;
}

/*
 * Main rules
 */

html {
    font-size: var(--editor-font-size);
    height: 100%;
    overflow-y: auto !important;
}

body {
    color: var(--text-primary-color);
    font-family: var(--editor-font-family);
    font-weight: var(--font-weight-normal);
    line-height: $line-height;
}

body#tinymce {
    background: var(--bg-primary);
    -webkit-font-smoothing: antialiased;
    font-size: inherit;
    margin: 1rem auto 0;
    max-width: var(--editor-width);
    overflow-y: initial !important;
    padding: 0 0 1.4rem !important;
    width: 100%;

    & > :nth-child(1) {
        margin-top: 0;
    }
}

a:not(.btn):not(.mce-item-anchor):not(.gallery__item a) {
    @include links (var(--link-invert-color), var(--link-invert-color), var(--link-invert-color), var(--link-invert-color));
}

p,
ul,
ol,
dl,
table,
blockquote,
hr {
    margin-top: baseline(7);
}

figure,
.gallery {
    margin-top: baseline(9);
    margin-bottom: baseline(9);
}

pre,
table,
script {
    margin-top: baseline(7);
    margin-bottom: baseline(7);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--headings-color);
    font-family: var(--font-base);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing);
    line-height: 1.3;
    margin-top: baseline(10);
}

h1 {
    font-size: $h1;
}

h2 {
    font-size: $h2;
}

h3 {
    font-size: $h3;
}

h4 {
    font-size: $h4;
}

h5 {
    font-size: $h5;
}

h6 {
    font-size: $h6;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    & + p {
        margin-top: baseline(3);
    }
}

b,
strong {
    color: var(--headings-color);
    font-weight: var(--font-weight-bold);
}

blockquote {
    border-left: 2px solid var(--gray-3);
    font-family: var(--font-serif);
    font-style: italic;
    padding: 0 0 0 baseline(6);
    position: relative;

    & > :nth-child(1) {
        margin-top: 0;
    }
}

ul,
ol {
    margin-left: 2rem;

    & > li {
        list-style: inherit;
        padding-left: baseline(2);
    }

    ul,
    ol {
        margin-bottom: baseline(2);
        margin-top: baseline(2);
    }
}

dl {
    dt {
        font-weight: var(--font-weight-bold);
    }
}

code {
    background-color: var(--gray-1);
    border-radius: 2px;
    color: var(--warning);
    font-size: ms(-1);
    font-family: var(--font-monospace);
    padding: baseline(1) baseline(2);
}

pre {
    background-color: var(--gray-1);
    font-size: ms(-2);
    padding: baseline(6);
    white-space: pre-wrap;
    word-wrap: break-word;

    & > code {
        background: none;
        color: var(--headings-color);
        display: inline-block;
        font-size: inherit;
        font-weight: normal;
        padding: 0;
    }
}

table {
    border: 1px solid var(--input-border-color);
    border-collapse: collapse;
    border-spacing: 0;
    vertical-align: top;
    text-align: left;
    width: 100%;

    th {
        font-weight: var(--font-weight-semibold);
        padding: baseline(2.5) baseline(4);
    }

    td {
        border-top: 1px solid var(--input-border-color);
        padding: baseline(2.5) baseline(4);
    }
}

kbd {
    background: var(--headings-color);
    border-radius: 2px;
    color: var(--bg-primary);
    font-family: var(--font-monospace);
    font-size: 0.8888em;
    padding: baseline(0.5) baseline(1.5);
}

sub,
sup {
    font-size: 65%;
}

small {
    font-size: ms(-2);
}

hr:not(#read-more) {
    background: none;
    border: none;
    height: auto;
    line-height: 1;
    max-width: none;
    text-align: center;

    &::before {
        content: "* * *";
        color: var(--headings-color);
        font-size: 30px;
    }
}


figcaption {
    clear: both;
    color: var(--text-light-color);
    font-size: ms(-3);
    margin: baseline(3) 0 0;
    text-align: center;
}

kbd {
    background: var(--gray-1);
    border-radius: 1px;
    color: var(--headings-color);
    font-family: Menlo, Monaco, Consolas, Courier New, monospace;
    font-size: ms(-1);
    padding: baseline(0.5) baseline(1.5);
}

sub,
sup {
    font-size: 65%;
}

small {
    font-size: ms(-2);
}

hr#read-more {
    border: none;
    background-color: var(--text-primary-color);
    cursor: default;
    height: 1px;
    margin: baseline(10) 0 baseline(12);
    overflow: visible;
    position: relative;

    &:after {
        background: var(--input-bg);
        content: attr(data-translation);
        display: inline-block;
        font-family: var(--font-base);
        font-size: ms(-3);
        font-weight: var(--font-weight-semibold);
        left: 50%;
        padding: 6px 16px;
        position: absolute;
        top: 50%;
        transform: translateX(-50%) translateY(-50%);
    }
}


/*
 * Basic buttons
 */

.btn {
    background: var(--button-bg);
    border: 1px solid var(--button-bg);
    border-radius: var(--border-radius);
    color: var(--white);
    cursor: pointer;
    display: inline-block;
    font-family: inherit;
    font-size: ms(-1);
    font-weight: var(--font-weight-normal);
    line-height: 1.6;
    padding: baseline(2) baseline(4);
    vertical-align: middle;
    text-align: center;
    transition: all 0.24s ease;
    overflow: hidden;
    will-change: transform;

    &:hover,
    &:active,
    &:focus {
        background: var(--button-bg-hover);
        border-color: var(--button-bg-hover);
        text-decoration: none !important;
    }
}

[type=button],
[type=submit],
button {
    @extend .btn;

}

/*
 * Basic forms
 */

fieldset {
    border: 1px solid var(--input-border-color);
    margin: 0 0 baseline(6);
    padding: baseline(6);

    & > legend {
        margin-left: -1rem;
        padding: 0 1rem;
    }
}

legend {
    font-weight: var(--font-weight-bold);
}

label {
    font-weight: var(--font-weight-bold);
    margin: 0 baseline(4) 0.8rem 0;
}

option {
    font-weight: var(--font-weight-normal);
}

[type=text],
[type=url],
[type=tel],
[type=number],
[type=email],
[type=search],
textarea,
select {
    background-color: var(--input-bg);
    border: 1px solid var(--input-border-color);
    border-radius: 0;
    font-family: inherit;
    color: var(--text-primary-color);
    font-size: ms(-1);
    outline: none;
    padding: baseline(2) baseline(3);
    width: auto;
    transition: all 0.24s ease;

    &::-webkit-input-placeholder {
        color: inherit;
    }
}


select {
    max-width: 100%;
    width: auto;
    position: relative;
}

select[multiple] {
    padding: baseline(6);
    width: 100%;
}

/*
 * Alignment
 */

.align-left {
    text-align: left;
}

.align-right {
    text-align: right;
}

.align-center {
    text-align: center;
}

/*
 * Post elements
 */
.post {

    &__image {
        &--left {
            float: left;
            margin-bottom: baseline(6);
            margin-right: baseline(6);
            max-width: 50%;
        }

        &--right {
            float: right;
            margin-bottom: baseline(6);
            margin-left: baseline(6);
            max-width: 50%;
        }

        &--center {
            display: block;
            margin-left: auto;
            margin-right: auto;
            text-align: center;
        }

        &--wide {
            margin-left: -10%;
            margin-right: -10%;

            & > img {
                width: 100%;
            }

        }

        &--full {
            margin-left: calc(50% - 50vw + 1.6rem);
            margin-right: calc(50% - 50vw + 1.6rem);

            & > img {
                width: 100%;
            }
        }
    }

    &__video {
        background: var(--gray-1);
        border: 2px dashed var(--input-border-color);
        position: relative;

        & > img.mce-object {
            background: var(--gray-1);
            border: 5px solid var(--bg-primary);
            position: relative;
            background-image: url("data:image/svg+xml;charset=UTF-8,%3c?xml version='1.0' encoding='utf-8'?%3e%3csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 68 48' xml:space='preserve'%3e%3cpath fill='%23cbcdd4' d='M64.82,6.36c-0.58-2.21-2.97-4.3-5.17-4.61C50.94,0.58,42.22,0,33.5,0S16.06,0.58,7.34,1.75 c-2.2,0.31-4.59,2.4-5.17,4.61c-2.9,11.43-2.9,22.85,0,34.28c0.58,2.21,2.97,4.3,5.17,4.61C16.06,46.42,24.78,47,33.5,47 s17.44-0.58,26.16-1.75c2.2-0.31,4.59-2.4,5.17-4.61C67.73,29.21,67.73,17.79,64.82,6.36z M43.21,24.78l-16.14,8.07 C26.12,33.32,25,32.63,25,31.57V23.5v-8.07c0-1.06,1.12-1.76,2.07-1.28l16.14,8.07C44.26,22.75,44.26,24.25,43.21,24.78z'/%3e%3c/svg%3e");
            background-repeat: no-repeat;
            background-size: 68px 48px;
            background-position: 50% 50%;
            max-height: 17rem;
        }
    }

    &__toc {

        margin-top: baseline(6);

        h3 {
            font-size: ms(1);
            margin: 0;
        }

        ul {
            counter-reset: item;
            list-style: decimal;
            margin-top: baseline(2);

            li {
                counter-increment: item;
                padding: 0;

                a {
                    background: none !important;
                    border: none !important;
                }
            }

            ul {
                margin-top: 0;

                li {
                    display: block;

                    &:before {
                        content: counters(item, ".") ". ";
                        margin-left: -2rem;
                    }
                }
            }
        }
    }
}

// Image alignment without parent container
img {

    &.post__image--full {
        margin-left: calc(50% - 50vw + 1.6rem);
        margin-right: calc(50% - 50vw + 1.6rem);
        width: 100vw;
        max-width: calc(100vw - 3.2rem);
    }

    &.post__image--wide {    
        margin-left: -10%;
        margin-right: -10%;
        max-width: 100vw;
        width: calc(100% + 20%);
    }
}

.msg {
    border: 1px solid transparent;
    border-radius: 3px;
    padding: baseline(4);

    &--highlight {
        background-color: rgba(var(--yellow), .1);
        border-color: rgba(var(--yellow), .5);
    }

    &--info {
        background-color: rgba(var(--color-primary-rgb), .1);
        border-color: rgba(var(--color-primary-rgb), .5);
    }

    &--success {
        background-color: rgba(var(--success-rgb), .1);
        border-color: rgba(var(--success-rgb), .51);
    }

    &--warning {
        background-color: rgba(var(--warning-rgb), .1);
        border-color: rgba(var(--warning-rgb), .5);
    }
}

.dropcap {
    &:first-letter {
        color: var(--headings-color);
        float: left;
        font-size: ms(9);
        font-weight: var(--font-weight-bold);
        line-height: 0.7;
        margin-right: baseline(2);
        padding: baseline(1.5) baseline(1) baseline(2) 0;
    }
}

/*
 * Gallery
 */
.gallery {
    cursor: pointer !important;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    position: relative;
    -webkit-user-select: none;
    user-select: none;

    &[data-is-empty="true"] {
        border: 2px dashed var(--input-border-color);
        padding: 5rem;

        &:after {
            background: var(--button-secondary-bg);
            border: 1px solid var(--button-secondary-bg);
            border-radius: var(--border-radius);
            color: var(--button-secondary-color);
            content: attr(data-translation);
            font-family: var(--font-base);
            font-size: 15px;
            font-weight: var(--font-weight-semibold);
            left: 50%;
            margin: 0;
            padding: 0.3rem .9rem;
            position: absolute;
            pointer-events: none;
            text-align: center;
            top: 8rem;
            transform: translateX(-50%) translateY(-50%);
            white-space: nowrap;
        }

        &:before {
            background-color: var(--icon-quaternary-color);
            bottom: 0;
            content: "";
            left: 0;
            mask: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 148'%3e%3cpath d='M157.887,44.459L52.274,10.298c-4.204-1.36-8.714.946-10.074,5.15l-25.236,78.02c-1.36,4.204.946,8.714,5.15,10.074l105.612,34.161c4.204,1.36,8.714-.946,10.074-5.15l25.236-78.02c1.36-4.204-.946-8.714-5.15-10.074ZM58.702,68.763c-7.454,0-13.496-6.044-13.496-13.5s6.042-13.5,13.496-13.5,13.496,6.044,13.496,13.5-6.042,13.5-13.496,13.5Z' opacity='.39'/%3e%3cg%3e%3cpath d='M26.525,101.386l23.854-17.207c1.309-.944,3.057-1.009,4.433-.165l13.435,8.247c1.432.879,3.261.769,4.577-.274l46.564-36.911c1.516-1.202,3.674-1.146,5.127.131l28.984,25.498-.033,34.303c-.004,4.415-3.585,7.992-8,7.992H34.5c-4.424,0-8.008-3.591-8-8.015l.025-13.599Z' /%3e%3cpath d='M145.5,25H34.5c-4.418,0-8,3.582-8,8v82c0,4.418,3.582,8,8,8h111c4.418,0,8-3.582,8-8V33c0-4.418-3.582-8-8-8ZM58.702,68.763c-7.454,0-13.496-6.044-13.496-13.5s6.042-13.5,13.496-13.5,13.496,6.044,13.496,13.5-6.042,13.5-13.496,13.5Z' opacity='.39'/%3e%3c/g%3e%3cg%3e%3cpath d='M13.5,27c-.829,0-1.5-.671-1.5-1.5v-3.105c0-.126.003-.252.01-.376.007-.129.016-.251.028-.373.013-.13.029-.251.047-.372.021-.129.043-.251.068-.372.026-.123.054-.243.085-.363.031-.117.064-.233.1-.346.035-.112.075-.227.115-.338.045-.121.091-.237.141-.351.045-.104.095-.215.148-.324.054-.11.111-.22.17-.327.055-.099.116-.204.179-.306.06-.097.126-.198.194-.297.071-.103.14-.2.211-.292.068-.089.142-.182.217-.272.078-.093.156-.181.234-.267.076-.084.16-.169.243-.252.087-.087.179-.173.271-.255.091-.081.18-.157.271-.23.086-.071.179-.142.272-.212.105-.077.202-.145.302-.21.104-.069.204-.132.306-.193.104-.062.209-.123.317-.179.108-.057.213-.11.319-.16.108-.051.219-.101.33-.147.113-.047.226-.091.339-.132.116-.041.229-.079.343-.114.112-.036.237-.069.361-.101.115-.029.234-.056.354-.081.124-.025.247-.047.37-.066.123-.018.241-.033.361-.046.135-.015.262-.023.391-.03.133-.006.259-.01.386-.01h4.012c.829,0,1.5.671,1.5,1.5s-.671,1.5-1.5,1.5h-4.012c-.079,0-.158.002-.236.006-.068.004-.143.009-.217.017l-.238.03c-.068.01-.142.023-.216.038s-.149.032-.222.05c-.068.018-.135.035-.2.055l-.226.076c-.066.024-.136.052-.204.08-.063.026-.13.057-.196.088l-.201.101c-.059.032-.121.067-.182.104l-.185.117c-.056.037-.115.078-.173.12l-.337.275c-.045.041-.094.085-.141.131-.05.05-.101.101-.149.154l-.41.514c-.036.052-.074.11-.11.169-.041.065-.075.126-.109.188-.036.065-.067.125-.097.187-.031.063-.061.127-.088.192-.029.068-.055.132-.079.196-.023.064-.048.133-.07.203l-.063.218c-.018.066-.034.136-.048.206-.015.071-.029.143-.04.215-.01.067-.02.143-.028.218-.007.07-.013.148-.017.225-.003.068-.006.145-.006.223v3.105c0,.829-.671,1.5-1.5,1.5Z' /%3e%3cpath d='M24.5,133h-4.012c-.127,0-.253-.004-.379-.01-.127-.006-.253-.017-.378-.028-.13-.013-.261-.029-.389-.05-.114-.017-.243-.039-.37-.065-.104-.021-.221-.048-.337-.076-.127-.032-.241-.064-.351-.098-.132-.04-.252-.081-.369-.123-.106-.038-.229-.085-.348-.136-.104-.045-.21-.092-.314-.141-.106-.05-.211-.104-.316-.158-.114-.061-.224-.123-.331-.188-.09-.054-.19-.116-.29-.182-.098-.064-.193-.133-.288-.2-.101-.074-.197-.149-.291-.225-.096-.079-.185-.154-.272-.232-.083-.072-.168-.154-.251-.234-.094-.092-.178-.18-.259-.268-.085-.095-.163-.183-.238-.272-.071-.083-.145-.177-.218-.272-.07-.093-.137-.186-.202-.278-.077-.111-.143-.213-.206-.316-.062-.099-.123-.204-.183-.312-.055-.101-.111-.207-.164-.315-.053-.108-.104-.218-.151-.329-.049-.113-.095-.227-.137-.344s-.081-.228-.116-.339c-.036-.117-.069-.23-.1-.345-.032-.119-.06-.241-.085-.363-.025-.12-.048-.243-.067-.364-.019-.127-.036-.25-.048-.372-.013-.128-.022-.251-.029-.373-.006-.133-.01-.259-.01-.384v-5.105c0-.828.671-1.5,1.5-1.5s1.5.672,1.5,1.5v5.105c0,.076.002.153.006.23.004.068.01.146.018.224.007.067.017.144.028.218.01.064.024.137.039.207s.03.14.048.208l.136.43c.021.059.048.123.075.187.028.065.058.13.088.193.031.063.063.125.098.187.036.065.07.124.105.182.04.064.078.123.117.181l.124.17c.043.057.087.111.132.165l.151.173c.04.043.088.094.137.143l.325.29c.048.039.103.083.159.123l.364.241c.068.041.126.074.185.105l.411.194c.062.026.123.05.183.071.081.029.148.053.215.072l.435.109c.08.018.149.028.218.039.085.013.156.021.226.028.076.008.153.015.23.019.078.004.157.006.236.006h4.012c.829,0,1.5.672,1.5,1.5s-.671,1.5-1.5,1.5Z' /%3e%3cpath d='M160.512,133h-4.012c-.828,0-1.5-.672-1.5-1.5s.672-1.5,1.5-1.5h4.012c.079,0,.158-.002.237-.006.066-.004.135-.008.201-.016.09-.01.165-.018.239-.029.085-.013.153-.024.221-.038.093-.019.166-.036.238-.054.062-.016.136-.036.207-.058l.206-.069c.077-.027.141-.054.203-.079.068-.028.137-.06.203-.091s.133-.065.197-.1c.059-.031.117-.064.174-.099l.196-.123c.059-.038.115-.079.172-.12l.334-.271c.058-.051.105-.097.152-.143l.282-.308c.057-.065.097-.117.136-.169l.134-.186c.04-.057.075-.111.109-.167l.11-.188c.033-.062.065-.124.097-.187l.092-.199c.023-.055.049-.116.07-.179l.136-.425c.021-.077.035-.143.049-.207.018-.081.029-.148.039-.215.014-.081.022-.15.028-.218.008-.074.015-.15.019-.225.004-.076.006-.152.006-.229v-3.105c0-.828.672-1.5,1.5-1.5s1.5.672,1.5,1.5v3.105c0,.126-.004.251-.01.375-.006.126-.017.251-.028.374-.014.13-.03.26-.051.387-.017.112-.04.24-.066.365-.022.112-.053.238-.086.363-.026.1-.06.213-.094.325-.042.132-.081.245-.122.355-.038.104-.085.223-.135.34-.05.114-.1.222-.151.328-.053.109-.108.217-.167.321-.057.104-.117.206-.179.307-.065.106-.134.212-.206.314-.064.093-.134.189-.205.282-.066.089-.146.188-.226.283-.061.073-.139.161-.217.247-.092.099-.171.181-.251.261-.096.095-.187.18-.279.262-.079.07-.167.146-.258.22-.101.081-.192.152-.287.222-.098.072-.195.141-.297.208-.1.065-.199.128-.301.188-.097.059-.206.121-.317.18-.105.056-.211.109-.318.16s-.219.1-.328.146c-.115.049-.233.095-.353.137-.098.036-.211.073-.323.109-.129.039-.247.071-.365.102-.128.032-.248.06-.37.084-.11.023-.237.045-.368.064-.106.017-.232.032-.358.045-.12.015-.255.024-.391.03-.127.006-.253.01-.381.01Z' /%3e%3cpath d='M166.5,29c-.828,0-1.5-.671-1.5-1.5v-5.105c0-.077-.002-.154-.006-.23-.004-.075-.011-.15-.019-.225-.007-.068-.015-.137-.026-.204-.012-.082-.024-.149-.038-.215-.017-.08-.031-.144-.049-.208l-.136-.429c-.025-.074-.049-.131-.073-.187l-.192-.392c-.033-.062-.069-.122-.106-.181-.034-.056-.069-.11-.106-.164-.045-.065-.083-.12-.125-.173-.052-.069-.095-.123-.14-.177l-.149-.17c-.039-.043-.083-.089-.129-.134l-.327-.293c-.055-.044-.109-.087-.166-.128l-.362-.241c-.061-.036-.122-.072-.185-.105-.064-.035-.131-.068-.197-.1l-.216-.096c-.064-.028-.13-.052-.195-.076-.06-.021-.128-.044-.194-.065-.075-.022-.144-.042-.214-.06l-.23-.053c-.074-.015-.146-.027-.22-.039-.071-.011-.15-.021-.228-.029-.07-.007-.15-.013-.229-.017-.071-.003-.15-.006-.229-.006h-4.012c-.828,0-1.5-.671-1.5-1.5s.672-1.5,1.5-1.5h4.012c.128,0,.254.003.38.009.132.007.257.017.379.029.129.013.253.029.374.047.131.02.256.042.378.067.116.023.233.05.351.08.119.029.24.063.357.1.112.033.233.074.35.116.122.045.24.09.354.138.105.045.212.092.315.141.107.051.213.105.318.16.107.057.214.118.317.179.102.061.201.124.301.189.102.068.194.134.287.201.103.075.198.149.292.226.092.074.179.149.267.227.088.077.172.158.256.239.091.087.178.178.263.271.083.091.16.179.235.268.073.087.147.181.221.278.065.084.137.185.207.286.064.092.133.197.198.303.062.103.124.207.183.313.057.104.111.208.163.314s.102.215.148.324c.052.12.101.241.145.365.035.095.074.206.11.319.038.125.072.241.102.356.03.112.061.237.086.365.024.111.047.238.066.365.018.113.035.242.048.372.012.124.022.248.028.373s.01.251.01.376v5.105c0,.829-.672,1.5-1.5,1.5Z' /%3e%3c/g%3e%3c/svg%3e");
            -webkit-mask: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 148'%3e%3cpath d='M157.887,44.459L52.274,10.298c-4.204-1.36-8.714.946-10.074,5.15l-25.236,78.02c-1.36,4.204.946,8.714,5.15,10.074l105.612,34.161c4.204,1.36,8.714-.946,10.074-5.15l25.236-78.02c1.36-4.204-.946-8.714-5.15-10.074ZM58.702,68.763c-7.454,0-13.496-6.044-13.496-13.5s6.042-13.5,13.496-13.5,13.496,6.044,13.496,13.5-6.042,13.5-13.496,13.5Z' opacity='.39'/%3e%3cg%3e%3cpath d='M26.525,101.386l23.854-17.207c1.309-.944,3.057-1.009,4.433-.165l13.435,8.247c1.432.879,3.261.769,4.577-.274l46.564-36.911c1.516-1.202,3.674-1.146,5.127.131l28.984,25.498-.033,34.303c-.004,4.415-3.585,7.992-8,7.992H34.5c-4.424,0-8.008-3.591-8-8.015l.025-13.599Z' /%3e%3cpath d='M145.5,25H34.5c-4.418,0-8,3.582-8,8v82c0,4.418,3.582,8,8,8h111c4.418,0,8-3.582,8-8V33c0-4.418-3.582-8-8-8ZM58.702,68.763c-7.454,0-13.496-6.044-13.496-13.5s6.042-13.5,13.496-13.5,13.496,6.044,13.496,13.5-6.042,13.5-13.496,13.5Z' opacity='.39'/%3e%3c/g%3e%3cg%3e%3cpath d='M13.5,27c-.829,0-1.5-.671-1.5-1.5v-3.105c0-.126.003-.252.01-.376.007-.129.016-.251.028-.373.013-.13.029-.251.047-.372.021-.129.043-.251.068-.372.026-.123.054-.243.085-.363.031-.117.064-.233.1-.346.035-.112.075-.227.115-.338.045-.121.091-.237.141-.351.045-.104.095-.215.148-.324.054-.11.111-.22.17-.327.055-.099.116-.204.179-.306.06-.097.126-.198.194-.297.071-.103.14-.2.211-.292.068-.089.142-.182.217-.272.078-.093.156-.181.234-.267.076-.084.16-.169.243-.252.087-.087.179-.173.271-.255.091-.081.18-.157.271-.23.086-.071.179-.142.272-.212.105-.077.202-.145.302-.21.104-.069.204-.132.306-.193.104-.062.209-.123.317-.179.108-.057.213-.11.319-.16.108-.051.219-.101.33-.147.113-.047.226-.091.339-.132.116-.041.229-.079.343-.114.112-.036.237-.069.361-.101.115-.029.234-.056.354-.081.124-.025.247-.047.37-.066.123-.018.241-.033.361-.046.135-.015.262-.023.391-.03.133-.006.259-.01.386-.01h4.012c.829,0,1.5.671,1.5,1.5s-.671,1.5-1.5,1.5h-4.012c-.079,0-.158.002-.236.006-.068.004-.143.009-.217.017l-.238.03c-.068.01-.142.023-.216.038s-.149.032-.222.05c-.068.018-.135.035-.2.055l-.226.076c-.066.024-.136.052-.204.08-.063.026-.13.057-.196.088l-.201.101c-.059.032-.121.067-.182.104l-.185.117c-.056.037-.115.078-.173.12l-.337.275c-.045.041-.094.085-.141.131-.05.05-.101.101-.149.154l-.41.514c-.036.052-.074.11-.11.169-.041.065-.075.126-.109.188-.036.065-.067.125-.097.187-.031.063-.061.127-.088.192-.029.068-.055.132-.079.196-.023.064-.048.133-.07.203l-.063.218c-.018.066-.034.136-.048.206-.015.071-.029.143-.04.215-.01.067-.02.143-.028.218-.007.07-.013.148-.017.225-.003.068-.006.145-.006.223v3.105c0,.829-.671,1.5-1.5,1.5Z' /%3e%3cpath d='M24.5,133h-4.012c-.127,0-.253-.004-.379-.01-.127-.006-.253-.017-.378-.028-.13-.013-.261-.029-.389-.05-.114-.017-.243-.039-.37-.065-.104-.021-.221-.048-.337-.076-.127-.032-.241-.064-.351-.098-.132-.04-.252-.081-.369-.123-.106-.038-.229-.085-.348-.136-.104-.045-.21-.092-.314-.141-.106-.05-.211-.104-.316-.158-.114-.061-.224-.123-.331-.188-.09-.054-.19-.116-.29-.182-.098-.064-.193-.133-.288-.2-.101-.074-.197-.149-.291-.225-.096-.079-.185-.154-.272-.232-.083-.072-.168-.154-.251-.234-.094-.092-.178-.18-.259-.268-.085-.095-.163-.183-.238-.272-.071-.083-.145-.177-.218-.272-.07-.093-.137-.186-.202-.278-.077-.111-.143-.213-.206-.316-.062-.099-.123-.204-.183-.312-.055-.101-.111-.207-.164-.315-.053-.108-.104-.218-.151-.329-.049-.113-.095-.227-.137-.344s-.081-.228-.116-.339c-.036-.117-.069-.23-.1-.345-.032-.119-.06-.241-.085-.363-.025-.12-.048-.243-.067-.364-.019-.127-.036-.25-.048-.372-.013-.128-.022-.251-.029-.373-.006-.133-.01-.259-.01-.384v-5.105c0-.828.671-1.5,1.5-1.5s1.5.672,1.5,1.5v5.105c0,.076.002.153.006.23.004.068.01.146.018.224.007.067.017.144.028.218.01.064.024.137.039.207s.03.14.048.208l.136.43c.021.059.048.123.075.187.028.065.058.13.088.193.031.063.063.125.098.187.036.065.07.124.105.182.04.064.078.123.117.181l.124.17c.043.057.087.111.132.165l.151.173c.04.043.088.094.137.143l.325.29c.048.039.103.083.159.123l.364.241c.068.041.126.074.185.105l.411.194c.062.026.123.05.183.071.081.029.148.053.215.072l.435.109c.08.018.149.028.218.039.085.013.156.021.226.028.076.008.153.015.23.019.078.004.157.006.236.006h4.012c.829,0,1.5.672,1.5,1.5s-.671,1.5-1.5,1.5Z' /%3e%3cpath d='M160.512,133h-4.012c-.828,0-1.5-.672-1.5-1.5s.672-1.5,1.5-1.5h4.012c.079,0,.158-.002.237-.006.066-.004.135-.008.201-.016.09-.01.165-.018.239-.029.085-.013.153-.024.221-.038.093-.019.166-.036.238-.054.062-.016.136-.036.207-.058l.206-.069c.077-.027.141-.054.203-.079.068-.028.137-.06.203-.091s.133-.065.197-.1c.059-.031.117-.064.174-.099l.196-.123c.059-.038.115-.079.172-.12l.334-.271c.058-.051.105-.097.152-.143l.282-.308c.057-.065.097-.117.136-.169l.134-.186c.04-.057.075-.111.109-.167l.11-.188c.033-.062.065-.124.097-.187l.092-.199c.023-.055.049-.116.07-.179l.136-.425c.021-.077.035-.143.049-.207.018-.081.029-.148.039-.215.014-.081.022-.15.028-.218.008-.074.015-.15.019-.225.004-.076.006-.152.006-.229v-3.105c0-.828.672-1.5,1.5-1.5s1.5.672,1.5,1.5v3.105c0,.126-.004.251-.01.375-.006.126-.017.251-.028.374-.014.13-.03.26-.051.387-.017.112-.04.24-.066.365-.022.112-.053.238-.086.363-.026.1-.06.213-.094.325-.042.132-.081.245-.122.355-.038.104-.085.223-.135.34-.05.114-.1.222-.151.328-.053.109-.108.217-.167.321-.057.104-.117.206-.179.307-.065.106-.134.212-.206.314-.064.093-.134.189-.205.282-.066.089-.146.188-.226.283-.061.073-.139.161-.217.247-.092.099-.171.181-.251.261-.096.095-.187.18-.279.262-.079.07-.167.146-.258.22-.101.081-.192.152-.287.222-.098.072-.195.141-.297.208-.1.065-.199.128-.301.188-.097.059-.206.121-.317.18-.105.056-.211.109-.318.16s-.219.1-.328.146c-.115.049-.233.095-.353.137-.098.036-.211.073-.323.109-.129.039-.247.071-.365.102-.128.032-.248.06-.37.084-.11.023-.237.045-.368.064-.106.017-.232.032-.358.045-.12.015-.255.024-.391.03-.127.006-.253.01-.381.01Z' /%3e%3cpath d='M166.5,29c-.828,0-1.5-.671-1.5-1.5v-5.105c0-.077-.002-.154-.006-.23-.004-.075-.011-.15-.019-.225-.007-.068-.015-.137-.026-.204-.012-.082-.024-.149-.038-.215-.017-.08-.031-.144-.049-.208l-.136-.429c-.025-.074-.049-.131-.073-.187l-.192-.392c-.033-.062-.069-.122-.106-.181-.034-.056-.069-.11-.106-.164-.045-.065-.083-.12-.125-.173-.052-.069-.095-.123-.14-.177l-.149-.17c-.039-.043-.083-.089-.129-.134l-.327-.293c-.055-.044-.109-.087-.166-.128l-.362-.241c-.061-.036-.122-.072-.185-.105-.064-.035-.131-.068-.197-.1l-.216-.096c-.064-.028-.13-.052-.195-.076-.06-.021-.128-.044-.194-.065-.075-.022-.144-.042-.214-.06l-.23-.053c-.074-.015-.146-.027-.22-.039-.071-.011-.15-.021-.228-.029-.07-.007-.15-.013-.229-.017-.071-.003-.15-.006-.229-.006h-4.012c-.828,0-1.5-.671-1.5-1.5s.672-1.5,1.5-1.5h4.012c.128,0,.254.003.38.009.132.007.257.017.379.029.129.013.253.029.374.047.131.02.256.042.378.067.116.023.233.05.351.08.119.029.24.063.357.1.112.033.233.074.35.116.122.045.24.09.354.138.105.045.212.092.315.141.107.051.213.105.318.16.107.057.214.118.317.179.102.061.201.124.301.189.102.068.194.134.287.201.103.075.198.149.292.226.092.074.179.149.267.227.088.077.172.158.256.239.091.087.178.178.263.271.083.091.16.179.235.268.073.087.147.181.221.278.065.084.137.185.207.286.064.092.133.197.198.303.062.103.124.207.183.313.057.104.111.208.163.314s.102.215.148.324c.052.12.101.241.145.365.035.095.074.206.11.319.038.125.072.241.102.356.03.112.061.237.086.365.024.111.047.238.066.365.018.113.035.242.048.372.012.124.022.248.028.373s.01.251.01.376v5.105c0,.829-.672,1.5-1.5,1.5Z' /%3e%3c/g%3e%3c/svg%3e");
            mask-repeat: no-repeat;
            -webkit-mask-repeat: no-repeat;
            mask-size: 125px 66px;
            -webkit-mask-size: 125px 66px;
            mask-position: 50% 2.3rem;
            -webkit-mask-position: 50% 2.3rem;
            position: absolute;
            right: 0;
            top: 0;
        }

        &:hover:after {
            background: var(--button-secondary-bg-hover);
            border-color: var(--button-secondary-bg-hover);
            color: var(--button-secondary-color-hover)
        }
    }

    &__item {
        flex-grow: 1;
        margin: 0;
        pointer-events: none;

        & a {
            display: block;
            height: 30vh;
            position: relative;
        }

        & img {
            height: inherit;            
            max-width: 100%;
            object-fit: cover;
            position: absolute;  
            width: 100%;
        }
    }

    &[data-columns="1"] .gallery__item {
        width: 100%;
    }

    &[data-columns="2"] .gallery__item {
        width: calc(100% / 2 - 1rem);
    }

    &[data-columns="3"] .gallery__item {
        width: calc(100% / 3 - 1rem);
    }

    &[data-columns="4"] .gallery__item {
        width: calc(100% / 4 - 1rem);
    }

    &[data-columns="5"] .gallery__item {
        width: calc(100% / 5 - 1rem);
    }

    &[data-columns="6"] .gallery__item {
        width: calc(100% / 6 - 1rem);
    }

    &[data-columns="7"] .gallery__item {
        width: calc(100% / 7 - 1rem);
    }

    &[data-columns="8"] .gallery__item {
        width: calc(100% / 8 - 1rem);
    }

    &-wrapper--full {
        margin-left: calc(50% - 50vw + 1.6rem);
        margin-right: calc(50% - 50vw + 1.6rem);
        width: 100vw;
        max-width: calc(100vw - 3.2rem);

        .gallery__item a {
            height: 50vh;
        }
    }

    &-wrapper--wide {
        margin-left: -10%;
        margin-right: -10%;
        width: calc(100% + 20%);
    }
}

/*
 * AMP conditional content tags
 */
publii-amp,
publii-non-amp {
    border: 1px dashed var(--input-border-color);
    display: block;
    margin: 30px 0;
    padding: 20px;
    position: relative;
}

publii-amp:before,
publii-non-amp:before {
    background: var(--bg-primary);
    color: var(--text-light-color);
    font-size: 12px;
    left: 50%;
    padding: baseline(1) baseline(2);
    position: absolute;
    top: 0;
    transform: translateX(-50%) translateY(-50%);
}

publii-amp:before {
    content: "This content will be visible only in the AMP version";
}

publii-non-amp:before {
    content: "This content won't be visible in the AMP version";
}

/*
 * Outline selected elements
 */
.mce-match-marker-selected {
    background: var(--color-primary);
}

.mce-content-body img[data-mce-selected],
.mce-content-body table[data-mce-selected],
.mce-content-body hr[data-mce-selected],
.mce-content-body [contentEditable=false] [contentEditable=true]:focus,
.mce-content-body [contentEditable=false] [contentEditable=true]:hover,
.mce-content-body [contentEditable=false][data-mce-selected],
.mce-content-body .mce-edit-focus {
    outline: 3px solid rgba(var(--color-primary-rgb), .55) !important;
}

.mce-content-body [data-mce-selected=inline-boundary],
.mce-content-body td[data-mce-selected],
.mce-content-body th[data-mce-selected] {
    background-color: rgba(var(--color-primary-rgb), .55) !important;
}



/*
 * Styling for obfuscated e-mails
 */
script {
    background: var(--gray-1);
    border: 2px dashed var(--input-border-color);
    border-radius: 3px;
    display: block;
    font-size: ms(-2);
    height: 2rem;
    padding: 2rem;
    overflow: hidden;
    padding: 2rem;
    position: relative;
    width: 100%;

    &:before {
        background: var(--gray-1);
        box-shadow: inset 0 0 0 5px var(--bg-primary);
        color: var(--text-light-color);
        content: "<script>";
        left: 0;
        line-height: 4rem;
        position: absolute;
        text-align: center;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
    }
}

a script {
    display: inline-block;
    height: 1.5rem;
    margin: 0;
    vertical-align: middle;
    width: 5rem;

    &:before {
        line-height: 1.5rem;
    }
}


/*
 * Styling for anchors
 */
.mce-item-anchor {
    background-color: var(--bg-primary);
    border: 2px solid $color-helper-6;
    border-radius: 50%;
    height: 20px !important;
    margin: 0 3px;
    position: relative;
    top: 4px;
    width: 20px !important;
}

// Prism.js 

code[class*="language-"],
pre[class*="language-"],
pre[class*="language-"] > code {
    color: var(--pre-color) !important;
    background: none;
    text-shadow: 0 1px rgba(0, 0, 0, 0.3);
    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
    font-size: ms(-2);
    text-align: left;
    white-space: pre;
    word-spacing: normal;
    word-break: normal;
    word-wrap: normal;
    line-height: 1.5;

    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;

    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
}

/* Code blocks */
pre[class*="language-"] {
    padding: baseline(6);
    margin: baseline(7) 0;
    overflow: auto;
    border-radius: 0.3em;
}

:not(pre) > code[class*="language-"],
pre[class*="language-"],
pre[class*="language-"] > code {
    background: #1e2128 !important;
}

/* Inline code */
:not(pre) > code[class*="language-"] {
    padding: .1em;
    border-radius: .3em;
    white-space: normal;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
    color: rgba(var(--white-rgb), .45);
}

.token.punctuation {
    color: #b3b9c5;
}

.namespace {
    opacity: .7;
}

.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
    color: #6ab0f3;
}

.token.boolean,
.token.number {
    color: #e1a6f2;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
    color: #ffd479;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable {
    color: #ac8d58;
    background: none;
}

.token.atrule,
.token.attr-value,
.token.function,
.token.class-name {
    color: #92d192;
}

.token.keyword {
    color: #ffeead;
}

.token.regex,
.token.important {
    color: #fd971f;
}

.token.important,
.token.bold {
    font-weight: bold;
}
.token.italic {
    font-style: italic;
}

.token.entity {
    cursor: help;
}

/* Prevent visual "jump" when classes are duplicated on img inside figure */
figure[class*="post__image"] img[class*="post__image"] {
    width: 100% !important;
    max-width: none !important;
    float: none !important;
    margin: 0 !important;
    display: block !important;
}
/* Fix misleading cursor on figure with image */
.mce-content-body figure[contentEditable=false][data-mce-selected],
.mce-content-body figure[contentEditable=false][data-mce-selected] img {
    cursor: pointer !important;
}
